<template>
    <div>
        <el-button @click="handlePrint" v-if="isShow">打 印</el-button>
        <!-- <div style="width: 60%;margin-left: 10%;margin-top: 50px;height: 1100px;background-color: #f2f2f2;padding: 60px 10px 10px 200px;">
            <table width="100%" height="100px" border="1px">
                <tr>
                    <td>1</td>
                    <td>1</td>
                </tr>
            </table>
        </div> -->
        <h3 style="text-align:center;">火车集装箱出港清单</h3>
        <table border="1" cellspacing="0" style="width: 900px;margin-top: 20px;">
            <tr style="text-align: center">
                <td style="width: 35px;">序号</td>
                <td style="width: 50px;">车皮号</td>
                <td style="width: 50px;">内外贸</td>
                <td style="width: 35px;">箱号</td>
                <td style="width: 50px;">铅封号</td>
                <td style="width: 35px;">尺寸</td>
                <td style="width: 35px;">箱型</td>
                <td style="width: 35px;">空重</td>
                <td style="width: 35px;">货名</td>
                <td style="width: 35px;">货重</td>
                <td style="width: 50px;">指挥手</td>
                <td style="width: 65px;">作业司机</td>
                <td style="width: 65px;">作业机械</td>
                <td style="width: 65px;">装车时间</td>
                <td style="width: 35px;">货主</td>
                <td style="width: 35px;">到站</td>
                <td style="width: 35px;">备注</td>
            </tr>
            <tr v-for="(item, index) in recordList2" style="text-align: center">
                <td>{{index+1}}</td>
                <td v-if="item.isMerge == true" rowspan="2">{{item.wagonNo}}</td>
                <td v-if="item.isMerge == false">{{item.wagonNo}}</td>
                <td>{{item.tradeType == 'O' ? '外贸' :'内贸'}}</td>
                <td>{{item.containerNo}}</td>
                <td>{{item.sealNo}}</td>
                <td>{{item.containerSize}}</td>
                <td>{{item.containerType}}</td>
                <td>{{item.ifHeavy == 'E' ? '空' : '重'}}</td>
                <td>{{item.cargoName}}</td>
                <td>{{item.cargoWeight}}</td>
                <td>{{item.commander}}</td>
                <td>{{item.driverName}}</td>
                <td>{{item.machineName}}</td>
                <td>{{item.jobTime}}</td>
                <td>{{item.entrustOrgName}}</td>
                <td>{{item.endStationName}}</td>
                <td></td>
            </tr>
        </table>
    </div>
</template>


<script>
import { records, trainJobPlanRecordsCount } from "@/api/gatePanel/gatePanel";

// 获取当前月份的最后一天的日期
function getCurrentMonthLast() {
    var date = new Date();
    var currentMonth = date.getMonth();
    var nextMonth = ++currentMonth;
    var nextMonthFirstDay = new Date(date.getFullYear(), nextMonth, 1);
    var oneDay = 1000 * 60 * 60 * 24;
    return new Date(nextMonthFirstDay - oneDay)
        .toLocaleDateString()
        .split("/")[2];
}

export default {
    data() {
        return {
            condition: {
                search_GTE_date: "",
                search_LTE_date: "",
                search_EQ_recordType: ""
            }, // 查询条件
            recordList: [], // table数组
            recordList2: [], // table数组
            pageSearch: records, // 分页查询api接口
            title: "发车车皮记录",
            dialogForm: false,
            type: "",
            pageInfo: this.$defalutPage(),
            total: 0,
            form: {},
            isShow:true
        };
    },
    mounted() {
        this.condition = JSON.parse(window.localStorage.sendCarPrint)
        this.loadData(
                this.condition.search_GTE_date,
                this.condition.search_LTE_date,
                this.condition.search_EQ_recordType,
                ""
        )
    },
    methods: {
        handlePrint(){
            this.isShow = false
            this.$nextTick(()=>{
                window.print()
                window.close();
            })
        },
        objectSpanMethod({ row, column, rowIndex, columnIndex }) {
            if (
                column.property == "id" ||
                column.property == "wagonSortNo" ||
                column.property == "wagonNo" ||
                column.property == "endStationName" ||
                column.property == "stratStationName" ||
                column.property == "portStatus" ||
                column.property == "meetCarDate" ||
                column.property == "sendCarDate" ||
                column.property == "stopDate"
            ) {
                if (row.merge) {
                    //合并当前行
                    return {
                        rowspan: 2,
                        colspan: 1
                    };
                } else if (row.merged) {
                    //标记当前为已合并
                    return {
                        rowspan: 0,
                        colspan: 0
                    };
                }
            }
        },

        loadData(date1, date2, type, method) {
            // console.log(this.$refs.myRecords)

            setTimeout(() => {
                this.condition.search_EQ_recordType = type;
                this.condition.search_GTE_date = date1;
                this.condition.search_LTE_date = date2;
                if (method === "month") {
                    let month = new Date(
                        date1.split("-")[0] + "/" + date1.split("-")[1] + "/0"
                    );
                    this.condition.search_GTE_date =
                        date1.split("-")[0] + "-" + date1.split("-")[1] + "-01";
                    this.condition.search_LTE_date =
                        date1.split("-")[0] +
                        "-" +
                        date1.split("-")[1] +
                        "-" +
                        getCurrentMonthLast();
                }
                if (this.condition["search_GTE_date"].length < 11) {
                    this.condition["search_GTE_date"] =
                        this.condition["search_GTE_date"] + " 00:00:00";
                }
                if (this.condition["search_LTE_date"].length < 11) {
                    this.condition["search_LTE_date"] =
                        this.condition["search_LTE_date"] + " 23:59:59";
                }
                if (type == "send") {
                    this.title = "发车车皮记录";
                } else {
                    this.title = "接车车皮记录";
                }
                this.condition.iDisplayStart = this.pageInfo.pageStart - 1;
                this.condition.iDisplayLength = this.pageInfo.iDisplayLength;
                records(this.condition).then(res => {
                    this.total = res.data.iTotalRecords;
                    let _tmp = res.data.aaData;
                    for (let i = 0; i < _tmp.length; i++) {
                        //默认只有2条会重复
                        if (i % 2 == 1) {
                            //查询前一条数据
                            if (_tmp[i - 1].planNo == _tmp[i].planNo) {
                                //标记前一条数据为合并
                                _tmp[i - 1].merge = true;
                                //标记当前数据为已合并数据
                                _tmp[i].merged = true;
                            }
                            //查询后一条数据
                            if (_tmp[i + 1]) {
                                if (_tmp[i + 1].planNo == _tmp[i].planNo) {
                                    //标记当前数据为合并
                                    _tmp[i].merge = true;
                                    //标记后一条数据为已合并数据
                                    _tmp[i + 1].merged = true;
                                }
                            }
                        }
                        //- 2018-5-27 18：23 更改
                        //- 追加options参数,判断最后是否有操作按钮
                        _tmp[i].options = "";
                    }
                    this.recordList = _tmp;
                    this.recordList2 = _tmp;
                    let j = 0;
                    for (let i = 0; i < this.recordList2.length; i++) {
                        if (this.recordList2[i+1] != undefined && this.recordList2[i].planNo == this.recordList2[i+1].planNo){
                            this.recordList2[i].isMerge = true
                            i = i+1
                        } else {
                            this.recordList2[i].isMerge = false
                        }
                    }
                    console.log(_tmp, 111);
                });
                trainJobPlanRecordsCount(this.condition).then(res => {
                    console.log(res);
                    this.form = res.data;
                });
            }, 100);
        }
    }
};
</script>
